<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
    <link rel="stylesheet" href="../../static/css/font.css">
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
    <link rel="stylesheet" href="../../static/css/weadmin.css">
    <script src="../../lib/xm-select/xm-select.js"></script>
    <script src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script src="../../static/js/app.js"></script>
</head>
<body>
<div class="weadmin-body">
    <form class="layui-form" id="FirstForm">
        <input id="id" name="id" type="hidden" />
        <input id="insertTime" name="insertTime" type="hidden" />
        <div class="layui-form-item">
            <label class="layui-form-label">菜单类型</label>
            <div class="layui-input-block">
                <input type="radio" name="istype" value="0" title="菜单" checked="">
                <input type="radio" name="istype" value="1" title="页面">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="name" class="layui-form-label">
                <span class="we-red">*</span>菜单名称
            </label>
            <div class="layui-input-inline">
                <input type="text" id="name" name="name" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label for="pid" class="layui-form-label">上级菜单</label>
            <div class="layui-input-inline">
                <input type="hidden" name="pid" id="pid" />
                <input type="text" id="ss" name="ss" placeholder="请选择上级菜单" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="zindex" class="layui-form-label">菜单排序</label>
            <div class="layui-input-inline">
                <input type="text" id="zindex" name="zindex" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label for="code" class="layui-form-label">菜单编号</label>
            <div class="layui-input-inline">
                <input type="text" id="code" name="code" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="page" class="layui-form-label">菜单url</label>
            <div class="layui-input-inline">
                <input type="text" id="page" name="page" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form">
            <label class="layui-form-label"><span class="we-red">*</span>分配角色</label>
            <div class="layui-input-block">
                <!-- 一定要加multiple属性啊,否则回显时会有问题-->
                <div id="roleIds" class="xm-select-demo" name="roleIds"></div>
                <!--<select id="roleIds" name="roleIds"  multiple="multiple"></select>-->
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label for="descpt" class="layui-form-label">描述</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入内容" id="descpt" name="descpt" class="layui-textarea"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn" lay-submit="" lay-filter="submit1">提交</button>
        </div>
    </form>
</div>
<script>
    var act = GetUrlParam("act");
    layui.use(['table','jquery','form'], function(){
        var form = layui.form,$=layui.jquery;
        form.render();

        //打开菜单选项
        $("#ss").click(function(){
            var  that = this;
            top.layer.open({
                type: 2,
                offset: 'auto',
                skin: 'layui-layer-molv',
                title: "选择菜单",
                area: ['300px', '450px'],
                shade: 0,
                shadeClose: false,
                content: "./menutree.html",
                btn: ['确定', '取消'],
                btn1: function (index,layero) {
                    var iframeWin = layero.find('iframe')[0];
                    var node = iframeWin.contentWindow.ztree.getSelectedNodes();
                    var parentId = node[0].id;
                    var parentName = node[0].name;
                    that.value=parentName;
                    $("#pid").val(parentId);
                    top.layer.close(index);
                }
            });
        })
        //监听提交
        form.on('submit(submit1)', function(data){
            data.field.roleIds = data.field.select;
            var f= data.field;
            new APIRequest(
                {
                    url: global.api_url + "/sysPermission/addPermit",
                    header: {content_type: "application/json;charset=UTF-8",Authorization:getUser().token},
                    data:f,
                    method: "Post",
                    async: false,
                    success: function (result) {
                        parent.location.reload();//刷新父页面
                        layer.msg("添加权限成功");
                    },
                    dataType: "json"
                }
            );
            return false;
        });
    });
    var demo1 = xmSelect.render({
        el: '#roleIds',
        prop: {
            name: 'sysRoleName',
            value: 'id',
        },
        data: []
    })
    new APIRequest(
        {
            url: global.api_url + "/sysRole/selectAll1",
            header: {content_type: "application/json;charset=UTF-8",Authorization:getUser().token},
            method: "POST",
            async: false,
            success: function (result) {
                demo1.update({
                    data: result.data,
                    autoRow: true,
                })
            },
            dataType: "json"
        }
    );


</script>
</body>
</html>